<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>示例</title>

    <style>

        [v-cloak] {
            display: none;
        }

    </style>
</head>
<body>

    <!-- 在一般情况下，v-cloak 是一个解决初始化慢导致页面闪动的方法，对于简单的项目比较实用，但是在具有工程化的项目中，
        比如 webpack 和 vue-router 时，项目的 HTML 结构只有一个空的 div 元素，剩余的内容都是由路由去挂载不同组件完成的，
        所以不再需要 v-cloak
     -->
    <div id="app1" v-cloak>
        {{ message }}
    </div>

    <script src="https://unpkg.com/vue/dist/vue.min.js"></script>
    <script>

        var app1 = new Vue({
            el: "#app1",
            data: {
                message: '这是一段文本'
            }
        });


    </script>

</body>
</html>